<template>
    <div class="common-layout">
        <el-container>
            <el-header>
                <home-header/>
            </el-header>
            <el-container>
                <el-aside>
                    <home-menu/>
                </el-aside>
                <el-main>
                    <router-view/>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>

<script>
import HomeHeader from "./com/HomeHeader.vue";
import HomeMenu from "./com/HomeMenu.vue";
import {getUserInfo} from "../network/login/login";

export default {
    name: "OperatePanel",
    components: {HomeMenu, HomeHeader},
    methods: {
        getLoginUserInfo(){
            getUserInfo().then(vo=>{
                this.$response.handle({
                    data: vo,
                    successFn: ()=>{
                        this.$store.commit('setLoginUser',vo.data);
                    },
                    log: '登录员工信息'
                })
            })
        },
        init(){
            this.getLoginUserInfo();
        }
    },
    created() {

    },
    mounted(){
        //注册用户刷新瞬间的事件，将store中的数据转移到sessionStorage里面
        let state = this.$store.state;
        window.addEventListener("beforeunload",function(){
            sessionStorage.setItem("vuexSTATE",JSON.stringify(state));
        })
        // console.log('this.$router.getRoute',this.$router.getRoutes());
        // console.log('this.$router.options.routes',this.$router.options.routes);
    }
}
</script>

<style scoped>
/**{*/
/*    border: 1px solid red;*/
/*}*/
.el-header{
    background: #409eff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
}
.el-aside{
    width: 200px;
    overflow: auto;
    max-height: 660px;
}
.el-main {
    width: 100%;
    height: 660px;
    padding: 8px;
    background: rgb(232,237,244);
}
/*1520 + 721*/
.el-menu-item{
    width: 100%;
}
.el-sub-menu{
    width: 100%;
}
</style>
